import React, { Component } from 'react'

export default class Loadmore extends Component {
    constructor(){
        super()
        this.myref = React.createRef();
        this.state={
            flag:true
        }
    }
    componentDidMount(){
        
        window.addEventListener('scroll',this.scrFn)
        
        
    }
    scrFn=()=>{
        // console.log('滚动了')
        // // 可视窗口的高度
        // console.log(document.documentElement.clientHeight)
        // // 元素距离页面顶部高
        // console.log(this.myref.current.offsetTop)
        // // 滚动滚动
        // console.log(document.documentElement.scrollTop)
        if(document.documentElement.clientHeight+document.documentElement.scrollTop>=this.myref.current.offsetTop && this.state.flag){
            this.setState({
                flag:false
            })
            console.log('到达底部了')
            
            this.props.getdata((cs)=>{
                this.setState({
                    flag:cs
                })
            })
            console.log(this.props)
        }
    }
    componentWillUnmount(){
        window.removeEventListener('scroll',this.scrFn)
    }
    render() {
        return (
            <div ref={this.myref}>
                加载更多
            </div>
        )
    }
}
